<template>
  <view class="StuRecordDeatil">
    <uni-section type="line" title="记录分数类型">
      <template #right>
        <uni-tag
          :text="typeMap[recordDetails.scoreType].text"
          :type="typeMap[recordDetails.scoreType].type"
        />
      </template>
    </uni-section>
    <uni-section type="line" title="记录分数">
      <template #right>
        <uni-tag
          :text="recordDetails.score"
          :type="typeMap[recordDetails.scoreType].type"
        />
      </template>
    </uni-section>
    <uni-section type="line" title="备注">
      <uni-easyinput
        v-model="recordDetails.comment"
        type="textarea"
        placeholder="备注"
        disabled
      />
    </uni-section>
  </view>
  <MessageBoard
    @send="leaveWordHandler"
    :leaveWordList="recordDetails.leaveWordList"
  >
      <template #action="{row}">
        <uni-icons
          v-if="row.userId==user.id"
          type="trash"
          size="24"
          @click="delHandler(row.id)"
        />
      </template>
  </MessageBoard>
</template>

<script setup>
import { getRecordDetailByIdAndStuId } from "@/api/courseApi";
import { postRecordWithStu } from "@/api/teacherApi";
import { leaveWord, getLeaveWordByRecordStuId, delLwById } from "@/api/userApi";
import { useUserStore } from "@/store/modules/user";
import { onLoad } from "@dcloudio/uni-app";
import MessageBoard from "../components/MessageBoard.vue";
const prop = defineProps(["rId"]);
const {user}=useUserStore()
const delHandler=(id)=>{
  confirmModal("确定删除这条留言吗").then(res=>{
    delLwById(id).then(res=>{
      msgSuccess("删除成功")
       getLwData()
    })
  })
}
const getLwData=()=>{
 getLeaveWordByRecordStuId({ id: recordDetails.value.id }).then((res) => {
        if (Array.isArray(res.data)) {
          recordDetails.value.leaveWordList = res.data;
        }
      });
}
const leaveWordHandler = (val) => {
   if(!val){
    msgError("请先输入内容")
    return
  }
  const data = {
    studentRecordId: recordDetails.value.id,
    content: val,
  };
  leaveWord(data)
    .then((res) => {
      msgSuccess("发送成功");
     getLwData()
    })
    .catch((err) => {
      msgError("发送失败");
    });
};
const typeMap = {
  0: {
    text: "加分",
    type: "success",
  },
  1: {
    text: "减分",
    type: "error",
  },
  2: {
    text: "不加不减",
    type: "",
  },
};

const recordDetails = ref({
  id: "",
  score: 0,
  scoreType: 0,
  comment: "",
  leaveWordList: [],
});
const getRecordData = () => {
  getRecordDetailByIdAndStuId({
    recordId: prop.rId,
  }).then((res) => {
    recordDetails.value = res.data;
  });
};

onLoad(() => {
  getRecordData();
});
</script>

<style scoped lang="scss">
.StuRecordDeatil {
  padding: 30rpx 20rpx;
}
.radio {
  margin-right: 30rpx;
}
.text-btn {
  color: $uni-color-primary;
}
</style>
